<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">

<!-- www.phpied.com/conditional-comments-block-downloads/ -->
<!--[if IE]><![endif]-->

<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame  -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Kameleon</title>
<meta name="description" content="">
<meta name="author" content="">

<!-- Place favicon.ico and apple-touch-icon.png in the root of your domain and delete these references -->
<link rel="shortcut icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">

<!-- CSS - Setup -->
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/base.css" rel="stylesheet" type="text/css" />
<link href="css/grid.css" rel="stylesheet" type="text/css" />
<!-- CSS - Theme -->
<link id="theme" href="css/themes/light.css" rel="stylesheet" type="text/css" />
<link id="color" href="css/themes/blue.css" rel="stylesheet" type="text/css" />

<!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
<script src="js/modernizr-1.5.min.js"></script>
</head>

<!--[if IE 7 ]>    <body class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <body class="ie8"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<body>
<!--<![endif]-->
<div id="wrapper"> 
  
  <!-- start header -->
  <header> 
    <!-- logo -->
    <h1 id="logo"><a href="index.html">Kameleon</a></h1>
    <!-- nav -->
    <nav>
      <ul id="nav">
        <li><a href="index.html">Home</a></li>
        <li class="current"><a href="about.html">About</a>
          <ul>
            <li><a href="about.html">Who We Are</a></li>
            <li><a href="#">Misc Examples</a>
              <ul>
                <li><a href="grid.html">Column Examples</a></li>
                <li><a href="misc.html">Styled Elements</a></li>
              </ul>
            </li>
          </ul>
        </li>
        <li><a href="portfolio.html">Portfolio</a>
          <ul>
            <li><a href="portfolio.html">3 Column Portfolio</a></li>
            <li><a href="portfolio-list.html">Portfolio List</a></li>
          </ul>
        </li>
        <li><a href="services.html">Services</a>
          <ul>
            <li><a href="pricing.html">Pricing Table</a></li>
          </ul>
        </li>
        <li><a href="contact.html">Contact Us</a></li>
      </ul>
      <br class="cl" />
    </nav>
    <br class="cl" />
  </header>
  <!-- end header --> 
  <!-- page container -->
  <div id="page"> 
    <!-- page title -->
    <h2 class="ribbon full">Misc Elements <span>Everything you'll ever need</span> </h2>
    <div class="triangle-ribbon"></div>
    <br class="cl" />
    <!-- page content -->
    <div id="page-content" class="container_12">
      <h3>Block Quote</h3>
      <blockquote>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <cite>John Doe</cite></blockquote>
      <h3>Lists</h3>
      <h4>Bullet List</h4>
      <ul class="bullet-list">
        <li>Lorum</li>
        <li>Ipsum</li>
        <li>Dorum</li>
      </ul>
      <h4>Definition List</h4>
      <dl class="definition">
        <dt>Lorum</dt>
        <dd>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</dd>
        <dt>Ipsum</dt>
        <dd>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</dd>
        <dt>Dolor</dt>
        <dd>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</dd>
      </dl>
      <h3>Notifications</h3>
      <div class="notification success"> <span class="strong">Success!</span> This is a success message. </div>
      <div class="notification error"> <span class="strong">Error!</span> This is a error message. </div>
      <div class="notification warning"> <span class="strong">Warning!</span> This is a warning message. </div>
      <div class="notification info"> <span class="strong">Information:</span> This is a informative message. </div>
      <div class="notification tip"> <span class="strong">Tip:</span> This is a tip message. </div>
      <h3>Buttons</h3>
      <button>Read More</button>
      <button class="blue">Read More</button>
      <button class="red">Read More</button>
      <button class="green">Read More</button>
      <button class="black">Read More</button>
      <button class="purple">Read More</button>
      <br />
      <button class="small">Read More</button>
      <button class="blue small">Read More</button>
      <button class="red small">Read More</button>
      <button class="green small">Read More</button>
      <button class="black small">Read More</button>
      <button class="purple small">Read More</button>
      <br />
      <button class="large">Read More</button>
      <button class="blue large">Read More</button>
      <button class="red large">Read More</button>
      <button class="green large">Read More</button>
      <button class="black large">Read More</button>
      <button class="purple large">Read More</button>
      <h3>Pagination</h3>
      <div class="pagination"> <a href="#">&lt; Prev</a> <a href="#" class="number">1</a> <a href="#" class="number current">2</a> <span class="dots">...</span> <a href="#" class="number">8</a> <a href="#" class="number">9</a> <a href="#">Next &gt;</a> </div>
      <br class="cl"/>
      <br />
      <div class="pagination small"> <a href="#">&lt; Prev</a> <a href="#" class="number">1</a> <a href="#" class="number current">2</a> <span class="dots">...</span> <a href="#" class="number">8</a> <a href="#" class="number">9</a> <a href="#">Next &gt;</a> </div>
    </div>
    <br class="cl" />
    <br class="cl" />
  </div>
  
  <!-- Footer Start -->
  <footer>
    <ul class="footer-nav">
      <li><a href="index.html">Home</a> |</li>
      <li><a href="about.html">About</a> |</li>
      <li><a href="portfolio.html">Portfolio</a> |</li>
      <li><a href="services.html">Services</a> |</li>
      <li><a href="contact.html">Contact</a></li>
    </ul>
    <p>Copyright ©2010, A <a href="http://www.mudodesigns.com">Mudo Design</a> for <a href="http://themeforest.net?ref=ChrisMooney">Theme Forest</a>.</p>
    <br class="cl" />
  </footer>
  <!-- footer end --> 
  
  <!-- Javascript at the bottom for fast page loading --> 
  <!-- Grab Google CDN's jQuery + jQuery UI. fall back to local if necessary --> 
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
  <script>!window.jQuery && document.write('<script src="js/jquery-1.4.2.min.js"><\/script>')</script> 
  <script type="text/javascript" src="js/jquery.tools.min.js"></script> 
  <script type="text/javascript" src="js/jquery.lightbox-0.5.min.js"></script> 
  <script type="text/javascript" src="js/jquery.form.js"></script> 
  <script src="js/cufon-yui.js" type="text/javascript"></script> 
  <script src="js/Aller.font.js" type="text/javascript"></script> 
  <script src="js/jquery.tipsy.js" type="text/javascript"></script> 
  <script src="js/functions.js" type="text/javascript"></script> 
  <!--[if lt IE 7 ]>
    <script src="js/dd_belatedpng.js"></script>
  <![endif]--> 
</div>
</body>
</html>